<template>
    <layout>
		<mt-header title="监护人信息">

    	 <mt-button slot="left" icon="back"></mt-button>

  			<mt-button slot="right"></mt-button>
		</mt-header>

		<div class="ol_box">

				<ol>
					<li>
						<div class="ol_sj">头像</div>
						<div class="touxiang">
							<img :src="showImage(guardian.headImage)" />
						</div>
					</li>
					<li>
						<div class="ol_sj">昵称</div>
						<div class="touxiang">
							{{ guardian.name }}
						</div>

					</li>
					<li>
						<div class="ol_sj">性别</div>
						<div class="touxiang">
							{{ sex }}
						</div>

					</li>
					<li>
						<div class="ol_sj">生日</div>
						<div class="touxiang">
							05-06
						</div>

					</li>
						<li>
						<div class="ol_sj">职业</div>
						<div class="touxiang">
							{{ guardian.position }}
						</div>

					</li>

					<li>
						<div class="ol_sj">月收入</div>
						<div class="touxiang">
							{{ guardian.detailAddress}}
						</div>
					</li>


						<li>
						<div class="ol_sj">与孩子关系</div>
						<div class="touxiang">
                            {{ guardian.relationship}}

                        </div>

					</li>

					<li>
						<div class="ol_sj">家庭地址</div>
						<div class="touxiang">
                            {{ guardian.detailAddress}}
						</div>
					</li>
				</ol>
			</div>

			<div class="footer" @click="del">删除此监护人</div>
    </layout>
</template>
<style lang="scss">
    @import "index.scss";
    img{
       /*background: red;*/
    }
</style>
<script type="text/babel">
    import { api, image } from 'framework/config.js';
    import Layout from "component/layout/standard";

    import Vue from 'vue'
    import Mint from 'mint-ui';
    Vue.use(Mint);

    export default {
        components: {
            Layout
        },
        data(){
            return {

            }
        },
        computed: {
            api(){
                return api();
            },
            sex(){
                if (this.guardian.sex == 1){
                    return "男";
                } else if (this.guardian.sex == 2){
                    return "女";
                } else {
                    return "未知";
                }
            }
        },
        methods: {
            showImage(url, params){
                return image(this.api.image, url, params);
            },
            del(){
                let params = new URLSearchParams();
                params.append("id", this.guardian.id);

                Mint.Indicator.open();
                this.$http.post('/api/guardian/delete',
                    params
                ).then((response) => {
                    Mint.Indicator.close();
                    if (response.status == 200){
                        let data = response.data;
                        if (data.code == 200) {
                            Mint.Toast('成功');
                        }else{
                            Mint.Toast('失败');
                        }
                    }else{
                        Mint.Toast('失败');
                    }
                });

            }
        },
        created(){
        },
        mounted() {
        }
    }
</script>

